// src/components/ContentDistribution/PublishTaskForm.jsx
import React, { useState } from 'react';
import { Form, Select, Button, Card, Row, Col, Input, DatePicker } from 'antd';
import { UserOutlined, TeamOutlined, SolutionOutlined } from '@ant-design/icons';

const PublishTaskForm = () => {
  const [form] = Form.useForm();
  const [targetType, setTargetType] = useState('role');

  // 模拟数据
  const contentOptions = [
    { value: 'sales_report', label: '销售报告' },
    { value: 'customer_analysis', label: '客户分析' },
    { value: 'financial_summary', label: '财务汇总' },
  ];

  const roleOptions = [
    { value: 'manager', label: '部门经理' },
    { value: 'sales', label: '销售团队' },
    { value: 'finance', label: '财务团队' },
  ];

  const departmentOptions = [
    { value: 'sales', label: '销售部' },
    { value: 'marketing', label: '市场部' },
    { value: 'finance', label: '财务部' },
  ];

  const userOptions = [
    { value: 'user1', label: '张三' },
    { value: 'user2', label: '李四' },
    { value: 'user3', label: '王五' },
  ];

  const handleSubmit = (values) => {
    console.log('发布任务参数:', values);
    // 这里调用API创建发布任务
  };

  return (
    <Card title="创建发布任务">
      <Form
        form={form}
        layout="vertical"
        onFinish={handleSubmit}
        initialValues={{ targetType: 'role' }}
      >
        <Row gutter={16}>
          <Col span={12}>
            <Form.Item
              name="content"
              label="选择发布内容"
              rules={[{ required: true, message: '请选择要发布的内容' }]}
            >
              <Select placeholder="选择数据表、报表或仪表盘">
                {contentOptions.map(option => (
                  <Select.Option key={option.value} value={option.value}>
                    {option.label}
                  </Select.Option>
                ))}
              </Select>
            </Form.Item>
          </Col>

          <Col span={12}>
            <Form.Item
              name="targetType"
              label="目标群体类型"
              rules={[{ required: true }]}
            >
              <Select onChange={setTargetType}>
                <Select.Option value="role">
                  <SolutionOutlined /> 按角色
                </Select.Option>
                <Select.Option value="department">
                  <TeamOutlined /> 按部门
                </Select.Option>
                <Select.Option value="user">
                  <UserOutlined /> 按用户
                </Select.Option>
              </Select>
            </Form.Item>
          </Col>
        </Row>

        <Row gutter={16}>
          <Col span={12}>
            <Form.Item
              name="target"
              label="选择目标群体"
              rules={[{ required: true, message: '请选择目标群体' }]}
            >
              {targetType === 'role' && (
                <Select mode="multiple" placeholder="选择角色">
                  {roleOptions.map(option => (
                    <Select.Option key={option.value} value={option.value}>
                      {option.label}
                    </Select.Option>
                  ))}
                </Select>
              )}

              {targetType === 'department' && (
                <Select mode="multiple" placeholder="选择部门">
                  {departmentOptions.map(option => (
                    <Select.Option key={option.value} value={option.value}>
                      {option.label}
                    </Select.Option>
                  ))}
                </Select>
              )}

              {targetType === 'user' && (
                <Select mode="multiple" placeholder="选择用户">
                  {userOptions.map(option => (
                    <Select.Option key={option.value} value={option.value}>
                      {option.label}
                    </Select.Option>
                  ))}
                </Select>
              )}
            </Form.Item>
          </Col>

          <Col span={12}>
            <Form.Item
              name="schedule"
              label="发布时间"
              rules={[{ required: true, message: '请设置发布时间' }]}
            >
              <DatePicker.RangePicker
                showTime
                format="YYYY-MM-DD HH:mm"
                style={{ width: '100%' }}
              />
            </Form.Item>
          </Col>
        </Row>

        <Form.Item
          name="description"
          label="任务描述"
        >
          <Input.TextArea placeholder="输入任务描述（可选）" rows={3} />
        </Form.Item>

        <Form.Item>
          <Button type="primary" htmlType="submit">
            创建发布任务
          </Button>
        </Form.Item>
      </Form>
    </Card>
  );
};

export default PublishTaskForm;
